<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<title>$title</title>
		<base href="$!path">
		<meta charset="UTF-8">
		<meta content="IE=Edge" http-equiv="X-UA-Compatible">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<!-- 新 Bootstrap 核心 CSS 文件 -->
		<link rel="stylesheet" href="$!path/resources/bootstrap-3.3.0/css/bootstrap.min.css">
		<!-- 可选的Bootstrap主题文件（一般不用引入） -->
		<link rel="stylesheet" href="$!path/resources/bootstrap-3.3.0/css/bootstrap-theme.min.css">
		<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
		<script src="$!path/resources/jquery/jquery-1.9.1.min.js"></script>
		<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
		<script src="$!path/resources/bootstrap-3.3.0/js/bootstrap.min.js"></script>
		<!-- dropdown 悬停触发 -->
		<script src="$!path/resources/bootstrap-3.3.0/js/bootstrap-hover-dropdown.min.js"></script>
		<style type="text/css">
			body {
			    background-color: #ffffff;
			    color: #red;
			    font-family: 微软雅黑;
			    font-size: 14px;
			    min-width: 320px;
			}
		</style>
		<script type="text/javascript">
			$(function(){
				$(".dropdown-menu").find(".no-close").click(function(e) {
				    e.stopPropagation();
				});
			});
		</script>
		$head
	</head>
	<body>
		<nav class="navbar navbar-default" role="navigation">
			<div class="container">
				<!-- Brand and toggle get grouped for better mobile display -->
				<div class="navbar-header">
					<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar_collapse">
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
					</button>
				</div>
		
				<!-- Collect the nav links, forms, and other content for toggling -->
				<div class="collapse navbar-collapse" id="navbar_collapse">
					<ul class="nav navbar-nav">
						<li>
							<a href="#">登录</a>
						</li>
						<li>
							<a href="#">注册</a>
						</li>
						<li class="dropdown">
							<a style="padding-top:5px;padding-bottom: 5px;" class="dropdown-toggle" data-toggle="dropdown">
								<img src="$!path/resources/images/face.jpg" width="40" class="img-circle">
								<span class="caret"></span>
							</a>  
							<ul class="dropdown-menu" role="menu" style="min-width: 300px;">
							    <li class="no-close" style="text-align: center;">
							    	<b>未读新消息</b>
							    </li>
						  	</ul>
						</li>
						<li class="dropdown">
							<a href="#" class="dropdown-toggle" data-toggle="dropdown">
								消息
								<span class="caret"></span>
							</a>
						  	<ul class="dropdown-menu" role="menu" style="min-width: 300px;">
							    <li class="no-close" style="text-align: center;">
							    	<b>未读新消息</b>
							    </li>
							    <li class="divider no-close"/>
							    <li class="no-close">
							   		<div class="container-fluid" style="min-height: 200px;" align="center">
							   			<p style="margin-top: 20px;">没有新消息了</p>
							   			<div style="width: 218px;height: 140px;background: url('$!path/resources/images/no-message.png') no-repeat center center;margin: auto 0;"></div>
							   		</div>
							    </li>
							    <li class="divider no-close"/>
							    <li class="no-close">
									<div class="container-fluid">
										<a>
											<span class="glyphicon glyphicon-cog"></span>
										</a>
										<a href="#" class="pull-right">查看全部</a>
									</div>						    
							    </li>
						  	</ul>
						</li>
					</ul>
					<ul class="nav navbar-nav navbar-right">
						<li>
							<a href="#">关于我们</a>
						</li>
					</ul>
				</div>
				<!-- /.navbar-collapse -->
			</div>
			<!-- /.container-fluid -->
		</nav>
		$body
	</body> 
</html>
